<!--病案复印管理首页-->
<script setup>
import {onMounted, ref} from "vue";
import {Search} from "@element-plus/icons-vue";
import axios from "axios";
import qs from "qs";
import router from "@/router";
import {ElMessage} from "element-plus";

onMounted(()=>{
  loadTableData();
})

//开始复印弹窗
const startCopyDialog=ref(false);
//完成复印弹窗
const completeCopyDialog=ref(false);
//开始邮寄弹窗
const mailInfoDialog=ref(false);
//临时信息存储
const appInfo=ref({
  id:'',
  newCheckStatus:0,
  checkStatus:0,
  checkTime:''
})
//展示表格数据
const duplicateTableData = ref([])
//搜索项表单
const selectForm=ref({
  caseId:'',
  admissionId:'',
  patientName:'',
  idCardId:'',
  createTime:'',
  checkStatusCode:''
})
//邮寄信息表单
const mailInfoForm=ref({
  mailCompany:"",
  orderId:''
})

//跳转到新增页面
const goAdd=()=>{
  router.push("/duplicate/medicalDuplicate/create");
}
//跳转到详情页面
const goDetail=(id)=>{
  router.push("/duplicate/medicalDuplicate/detail?id="+id);
}

//获取表格数据
const loadTableData=()=>{
  let param=qs.stringify(selectForm.value);
  axios.get(getBaseURL(1)+"/v1/duplicate/medical_duplicate/select?"+param).then((response)=>{
    duplicateTableData.value=response.data.data;
  })
}
//重置搜索
const resetSearch=()=>{
  selectForm.value={};
  loadTableData();
}

//申请状态表
const checkStatusCodeList=ref([
    {code:0,msg:'已提交'},
    {code:1,msg:'待审核'},
    {code:2,msg:'待支付'},
    {code:3,msg:'审核驳回'},
    {code:4,msg:'待复印'},
    {code:5,msg:'复印中'},
    {code:6,msg:'待寄件'},
    {code:7,msg:'待签收'},
    {code:8,msg:'已完成'},
    {code:9,msg:'取消支付'},
    {code:10,msg:'取消复印且退款'},
])
//证件类型显示转换
//领取方式显示转换
const pickupFormat=(row,column,cellValue,index)=>{
  if(cellValue==1){
    cellValue='寄件';
    return cellValue;
  }
  else if(cellValue==0){
    cellValue='自取';
    return cellValue;
  }
}
//申请状态显示转换
const checkStatusFormat=(row,column,cellValue,index)=>{
  for(let i=0;i<checkStatusCodeList.value.length;i++){
    if(checkStatusCodeList.value[i].code==cellValue) {
      cellValue=checkStatusCodeList.value[i].msg;
      return cellValue;
    }
  }
}
//开始复印弹窗
const showStartCopy=(id,status,checkTime)=>{
  startCopyDialog.value=true;
  appInfo.value.id=id;
  appInfo.value.checkStatus=status;
  appInfo.value.checkTime=checkTime;
  console.log(appInfo.value);
}
//开始复印关闭
const startCopyHandleClose=()=>{
  appInfo.value={};
  startCopyDialog.value=false;
}
//开始复印
const startCopy=()=>{
  appInfo.value.newCheckStatus=5;
  let data=qs.stringify(appInfo.value);
  axios.post(getBaseURL(1)+"/v1/duplicate/medical_duplicate/update",data).then((response)=>{
    if(response.data.code==2000){
      ElMessage.success("更新状态成功！");
      loadTableData();
      startCopyHandleClose();
    }
    else ElMessage.error(response.data.msg);
  })
}
//完成复印弹窗
const showCompleteCopy=(id,status,checkTime)=>{
  completeCopyDialog.value=true;
  appInfo.value.id=id;
  appInfo.value.checkStatus=status;
  appInfo.value.checkTime=checkTime;
  console.log(appInfo.value);
}
//完成复印关闭
const completeCopyHandleClose=()=>{
  appInfo.value={};
  completeCopyDialog.value=false;
}
//完成复印
const completeCopy=()=>{
  appInfo.value.newCheckStatus=6;
  let data=qs.stringify(appInfo.value);
  axios.post(getBaseURL(1)+"/v1/duplicate/medical_duplicate/update",data).then((response)=>{
    if(response.data.code==2000){
      ElMessage.success("更新状态成功！");
      loadTableData();
      completeCopyHandleClose();
    }
    else ElMessage.error(response.data.msg);
  })
}
//开始邮寄弹窗
const showStartMail=(id,status,checkTime)=>{
  mailInfoDialog.value=true;
  appInfo.value.id=id;
  appInfo.value.checkStatus=status;
  appInfo.value.checkTime=checkTime;
  console.log(appInfo.value);
}
//完成复印关闭
const mailInfoHandleClose=()=>{
  appInfo.value={};
  mailInfoDialog.value=false;
}
//填写邮寄信息并改变状态
const saveMailInfo=()=>{
  appInfo.value.newCheckStatus=7;
  let data=qs.stringify(appInfo.value);
  axios.post(getBaseURL(1)+"/v1/duplicate/medical_duplicate/update",data).then((response)=>{
    if(response.data.code==2000){
      mailInfoForm.value.applicationId=appInfo.value.id;
      let mailData=qs.stringify(mailInfoForm.value);
      console.log(mailData);
      axios.post(getBaseURL(1)+"/v1/duplicate/medical_duplicate/insert_mail",mailData).then((response)=>{
        if(response.data.code==2000){
          ElMessage.success('更新状态成功！');
          loadTableData();
          mailInfoHandleClose();
        }
        else {ElMessage.error(response.data.msg);}
      })
    }
    else {ElMessage.error(response.data.msg);}
  })
}
</script>

<template>
  <div class="common-layout">
    <div style="background-color:#F0F2F5;padding: 0;width: 100%;height: 100%;">
      <!--开始复印确认-->
      <el-dialog v-model="startCopyDialog" :show-close="false" width="400px" title="复印提示" style="text-align: center;border-radius: 10px;position: relative;top: 20%;">
        <el-text style="margin:20px 10px 30px 10px;display: inline-block;font-size: 15px;">是否开始复印操作，开始后状态将变更为复印中，是否继续？</el-text>
        <br>
        <el-button @click="startCopyHandleClose">取消</el-button>
        <el-button type="primary" @click="startCopy">开始复印</el-button>
      </el-dialog>
      <!--完成复印确认-->
      <el-dialog v-model="completeCopyDialog" :show-close="false" width="400px" title="完成复印提示" style="text-align: center;border-radius: 10px;position: relative;top: 20%;">
        <el-text style="margin:20px 10px 30px 10px;display: inline-block;font-size: 15px;">是否已完成本单复印？</el-text>
        <br>
        <el-button @click="completeCopyHandleClose">取消</el-button>
        <el-button type="primary" @click="completeCopy">完成复印</el-button>
      </el-dialog>
      <!--邮寄订单补充-->
      <el-dialog v-model="mailInfoDialog" :show-close="false" width="400px" title="邮寄信息" style="text-align: left;border-radius: 10px;position: relative;top: 20%;">
        <el-form label-width="auto">
          <el-form-item label="邮寄单位">
            <el-select default-first-option style="width: 200px" v-model="mailInfoForm.mailCompany">
              <el-option label="顺丰快递" value="10"/>
            </el-select>
          </el-form-item>
          <el-form-item label="运单单号">
            <el-input v-model="mailInfoForm.orderId" placeholder="请输入" style="width: 200px"/>
          </el-form-item>
        </el-form>
        <el-button @click="mailInfoHandleClose">取消</el-button>
        <el-button type="primary" @click="saveMailInfo">确认</el-button>
      </el-dialog>

      <el-card shadow="never" style="background-color:#fff;padding:20px 0;width: 90%;margin: 0 auto 20px auto;">
          <!--搜索项-->
          <el-form label-width="auto">
            <el-row :gutter="20" style="margin-bottom: 20px;padding:0 20px;text-align: center;">
              <el-col :span="8">
                <el-form-item label="病案号">
                  <el-input style="width: 200px" placeholder="请输入" v-model="selectForm.caseId"/>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="住院号">
                  <el-input style="width: 200px" placeholder="请输入" v-model="selectForm.admissionId"/>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="患者姓名">
                  <el-input style="width: 200px" placeholder="请输入" v-model="selectForm.patientName"/>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row :gutter="20" style="margin-bottom: 20px;padding:0 20px;text-align: center;">
              <el-col :span="8">
                <el-form-item label="证件号">
                  <el-input style="width: 200px" placeholder="请输入" v-model="selectForm.idCardId"/>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="申请时间">
                  <el-date-picker style="width: 200px" placeholder="请选择" v-model="selectForm.createTime"/>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="申请状态">
                  <el-select style="width: 200px;" placeholder="请选择" default-first-option v-model="selectForm.checkStatusCode">
                    <el-option v-for="item in checkStatusCodeList" :label="item.msg" :value="item.code"/>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row :gutter="20" style="padding:0 20px;text-align: center;">
              <el-col :span="24">
                <el-button type="primary" style="float: right;margin-left: 10px;" @click="loadTableData"><el-icon><Search/></el-icon>搜索</el-button>
                <el-button style="float: right;" @click="resetSearch">重置</el-button>
              </el-col>
            </el-row>
          </el-form>
        </el-card>

      <!--展示表格-->
      <el-card shadow="never" style="background-color:#fff;padding:20px 0;width: 90%;margin: 0 auto;">
          <el-button type="primary" style="float: right" @click="goAdd">新增复印登记</el-button>
          <el-table :data="duplicateTableData">
            <el-table-column label="病案号" property="caseId" width="150"/>
            <el-table-column label="住院号" property="admissionId" width="150"/>
            <el-table-column label="患者姓名" property="patientName" width="150"/>
            <el-table-column label="证件类型" property="idCardType" width="100"/>
            <el-table-column label="证件号" property="idCardId" width="200"/>
            <el-table-column label="复印份数" property="copyNum" width="100"/>
            <el-table-column label="领取方式" property="pickupType" width="100" :formatter="pickupFormat"/>
            <el-table-column label="申请状态" property="checkStatusCode" width="150" :formatter="checkStatusFormat"/>
            <el-table-column label="申请时间" property="createTime" width="200"/>
            <el-table-column label="复印内容" property="copyContent" width="200" show-overflow-tooltip/>
            <el-table-column label="操作" fixed="right" width="200">
              <template #default="scope">
                <!--根据订单状态显示对应操作-->
                <el-button type="text" v-if="scope.row.checkStatusCode===1" @click="goDetail(scope.row.id)">去审核</el-button>
                <el-button type="text" v-if="scope.row.checkStatusCode>1" @click="goDetail(scope.row.id)">查看</el-button>
                <el-button type="text" style="color: red" v-if="scope.row.checkStatusCode===2" @click="goDetail(scope.row.id)">收费</el-button>
                <el-button type="text" style="color:gray;" v-if="scope.row.checkStatusCode===2" @click="goDetail(scope.row.id)">取消申请</el-button>
                <el-button type="text" v-if="scope.row.checkStatusCode===4" @click="showStartCopy(scope.row.id,scope.row.checkStatusCode,scope.row.checkTime)">开始复印</el-button>
                <el-button type="text" style="color: red" v-if="scope.row.checkStatusCode===4" @click="goDetail(scope.row.id)">退款</el-button>
                <el-button type="text" v-if="scope.row.checkStatusCode===5" @click="showCompleteCopy(scope.row.id,scope.row.checkStatusCode,scope.row.checkTime)">完成复印</el-button>
                <el-button type="text" v-if="scope.row.checkStatusCode===6" @click="showStartMail(scope.row.id,scope.row.checkStatusCode,scope.row.checkTime)">邮寄</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-card>
    </div>
  </div>
</template>

<style scoped>

</style>